<template>
    <a-modal
      :title="title"
      :width="1000"
      :visible="visible"
      :confirmLoading="confirmLoading"
      @ok="handleOk"
      @cancel="handleCancel"
      cancelText="关闭"
    >
      <a-spin :spinning="confirmLoading">
        <a-form layout="inline"  @keyup.enter.native="searchQuery">
          <a-form-item label="手机号" v-if="queryParam.type == 1">
            <a-input placeholder="手机号" v-model="queryParam.tel"></a-input>
          </a-form-item>
          <a-form-item label="OPENID" v-if="queryParam.type == 2">
            <a-input placeholder="OPENID" v-model="queryParam.openId"></a-input>
          </a-form-item>
          <a-form-item label="">
            <a-button  @click="searchQuery" icon="search">查询</a-button>
          </a-form-item>
        </a-form>
        <div style="display:flex;margin:20px 0;">
          <a-button type="primary" @click="batchDel">批量删除</a-button>
          <div style="margin-left:20px;">
            <a-button  @click="handleImportXls" type="primary">批量导入</a-button>
            <j-import-modal ref="importModal" :uploadParams="getUploadParams()" @ok="importOk" :fileSize="10" :id="queryParam.pushId" 
            :type="queryParam.type"
            :templateUrl="templateUrl()"></j-import-modal>
          </div>
        </div>
      </a-spin>
      <a-table 
        :rowKey="record=>record.id"
        :row-selection="rowSelection" 
        :columns="columns" 
        :data-source="dataSource"  
        :pagination="ipagination"
        @change="handleTableChange"
       >
      </a-table>
    </a-modal>
</template>

<script>
import { filterObj } from '@/utils/util';
  import JImportModal from './tsImportModal'
  import globalData from '@/assets/js/common'
  import { JeecgListMixin } from '@/mixins/JeecgListMixin'

  export default {
    name:'rq',
    mixins:[JeecgListMixin],
    components: { JImportModal },
    data() {
      return {
        title: '',
        visible: false,
        confirmLoading: false,
        queryParam:{
          pushId:'',
          type:'',
          current: 1,
          size: 10,
        },
        type:'',
        columns:[
          {
            title: '序号',
            dataIndex: '',
            key: 'rowIndex',
            width: 120,
            align: "center",
            customRender: function (t, r, index) {
              return parseInt(index) + 1;
            }
          },
          {
            title: '手机号',
            dataIndex: 'tel',
          },
          {
            title: 'OPENID',
            dataIndex: 'openId',
          },
        ],
        selectedRowKeys:[],
        url: {
          list:'/backend/invitation/pagePushMember',
          deleteBatch: "/backend/invitation/deletePushMemberByIds",
        },
      }
    },
    created() {},
    computed: {
      rowSelection() {
        return {
          onChange: (selectedRowKeys) => {
            this.selectedRowKeys = selectedRowKeys
          },
          selectedRowKeys: this.selectedRowKeys
        };
      },
    },
    methods: {
      getQueryParams() {
        this.queryParam.current = this.ipagination.current
        this.queryParam.size = this.ipagination.pageSize
        var param = Object.assign({}, this.queryParam);
        return filterObj(param);
      },
      // -----------------导入
      handleImportXls() {
        this.$refs.importModal.show()
      },
      getUploadParams() {
        return { ...globalData.uploadParams }
      },
      // 上传成功后的方法
      importOk(result) {
        if (result == '操作成功') {
          this.$message.success('批量导入成功')
          this.searchQuery()
          this.$refs.importModal.close()
        }
      },
      // ---------------------end
      add() {
        this.edit({})
      },
      edit(record,type) {
        console.log(type,'type');
        this.queryParam.pushId = record.id
        this.queryParam.type = type
        this.selectedRowKeys = []
        this.searchQuery()
        this.visible = true
      },
      templateUrl() {
        return 'https://jnbyoss.oss-cn-hangzhou.aliyuncs.com/upload/20221117/5ccc6f86d874d2a1731b0317e43a8aa3.xlsx'
      },
      // 确定
      handleOk() {
        this.close()
      },
      // 关闭
      handleCancel() {
        this.close()
      },
      close() {
        this.$emit('close')
        this.visible = false
      },
    }
  }
</script>
<style scoped lang="less">

</style>